<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ page language="java" contentType="text/html;  charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html>
<html lang="ko">
	<head>
    <meta charset="utf-8">
    <meta name="description" content="${fn:escapeXml(post.title)}" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    
    <title>${post.title}</title>
    <!--[if lt IE 9]>
		<script src="/resources/js/html5shiv.js"></script>
		<script src="/resources/js/respond.min.js"></script>
    <![endif]-->
    <style type="text/css">
    	@media (max-width: 1015px){
			#itembox{ width: 55%!important; }
			.subbox{ width: 43.5%!important; }
		}
    	@media (max-width: 1200px){
			.container.content { padding:0!important; padding-left:15px!important; padding-right:15px!important;}
		}
		.container.content{
			padding-left: 100px;
			margin-top:35px;
			margin-bottom: 25px;
			overflow: hidden;
		}
		/* item */
		@media screen and (max-width: 767px){ 
			#itembox{
				width: 100%!important;
				padding:0;
				border-bottom-left-radius: 0!important;
				border-bottom-right-radius: 0!important;
			}
			.swipe-wrap > div{
				border-bottom-left-radius: 0!important;
				border-bottom-right-radius: 0!important;
			}
			.subbox{
				width: 100%!important;
				margin:0!important;
			}
			.subboxWrapper{
				border-top-left-radius: 0!important;
				border-top-right-radius: 0!important;
				border: 0!important;
			}
			.item-function {white-space:nowrap;}
			.item-function button{width:33.1%!important;font-size:13px!important;}
		}
		#itembox{
			float: left;
			width: 545px;
			background-color: #fff;
			-moz-box-shadow: 0 0 12px rgba(0,0,0,.1);
			-webkit-box-shadow: 0 0 12px rgba(0,0,0,.1);
			box-shadow: 0 0 12px rgba(0,0,0,.1);
			border-radius: 4px;
			overflow: hidden;
			position: relative;
			white-space: nowrap;
			-webkit-transition: all 0.3s;
	    	-moz-transition: all 0.3s;
	    	-o-transition: all 0.3s;
	    	transition: all 0.3s;
		}
		#itembox:hover .slide-image-arrow{
			visibility: visible;
		}
		.item-image{
			width: 100%;
			height: 100%;
			position: relative;
			margin: 0;
			padding: 0;
			overflow: hidden;
		}
		#image-list > li { margin-right: -2px; }
		.item-content{
			padding: 12px;
		}
		.section-count{
			font-size: 13px;
			padding: 14px;
		}
		.section-count a{
			text-decoration:none!important;
		}
		.item-function{
			padding: 6px 8px 10px 8px;
			position: relative;
			border-top: 1px solid #e7e7e7;
		}
		.item-function button{
			width: auto;
			border: 0;
			background-color: #fff;
			color: #555;
			font-size: 12px;
		}
		.item-function button > span{
			font-size: 13px;
			font-weight: bold;
			color: #555;
			padding-left: 5px;
		}
		
		.comment-wrapper{
			height: 100%;
			background-color: #f3f3f3;
			border-bottom-left-radius: 4px;
			border-bottom-right-radius: 4px;
		}
		.comment-list{
			padding: 8px 8px 0 8px;
			max-height: 390px;
			overflow: auto;
		}
		.comment{
			width: 100%;
			min-height: 45px;
			position: relative;
		}
		.comment:focus .comment-edit,.comment:hover .comment-edit,.comment:focus .comment-reply,.comment:hover .comment-reply,.comment:focus .comment-report,.comment:hover .comment-report{
			display: block;
		}
		.comment > .comment-profileImage{
			padding-top: 3px;
			float: left;
		}
		.comment > .comment-profileImage > a > img{
			width: 35px;
			height: 35px;
			border-radius: 2px;
		}
		.comment > .comment-info{
			margin-left: 45px;
		}
		.comment > .comment-info > .comment-content{
			padding-bottom: 6px;
			word-break: break-all;
		}
		.comment > .comment-info > .comment-time{
			font-size: 12px;
			color: #AAA;
			margin-left: 8px;
		}
		.comment > .comment-info > .comment-like{
			margin-left: 8px;
			cursor: pointer;
			color: #acacac;
			font-size: 13px;
		}
		.comment > .comment-info > .comment-like > span{
			color:#666;
			font-size:13px;
			font-weight:bold;
		}
		.comment > .comment-reply{
			position: absolute;
			top: 0;
			right: 23px;
			display: none;
		}
		.comment > .comment-reply > i{
			font-size: 14px;
			color: #AAA;
			cursor: pointer;
		}
		.comment > .comment-edit{
			position: absolute;
			top: 0;
			right: 0;
			display: none;
			background-color: transparent!important;
		}
		.comment > .comment-edit.open{
			display: block!important;
		}
		.comment > .comment-edit > i{
			font-size: 12px;
			color: #AAA;
			cursor: pointer;
		}
		.comment > .comment-report{
			position: absolute;
			top: 0;
			right: 0;
			display: none;
		}
		.comment > .comment-report > i{
			font-size: 14px;
			color: #AAA;
			cursor: pointer;
		}
		.cmt-dropdown{
			left:inherit!important;
			right: -7px!important;
			box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.22)!important;
			border: 0!important;
			margin-top: 12px!important;
			min-width: 80px!important;
		}
		.cmt-dropdown > li{
			text-align: center;
			padding: 4px 0;
			cursor: pointer;
			font-weight: bold;
			font-size: 13px;
		}
		.cmt-dropdown > li:hover{
			background-color: #eee;
		}
		.cmt-dropdown::after {
			position: absolute;
			top: -7px;
			right: 5px;
			display: inline-block;
			border-right: 9px solid transparent;
			border-bottom: 9px solid #fff;
			border-left: 9px solid transparent;
			content: '';
		}
		.cmt-dropdown::before {
			position: absolute;
			top: -9px;
			right: 5px;
			display: inline-block;
			border-right: 9px solid transparent;
			border-bottom: 9px solid #ccc;
			border-left: 9px solid transparent;
			border-bottom-color: rgba(0, 0, 0, 0.07);
			content: '';
		}
		#comment-write{
			padding: 8px 8px 12px 8px;
			position: relative;
		}
		#comment-write .dropdown-menu{
			width: 350px;
		}
		#comment-more{
			padding: 6px 0 10px 0;
			cursor: pointer;
			font-size: 13px;
			color: #333;
			display: none;
		}
		
		#comment-update{
			display: none;
			padding: 8px 8px;
			border-bottom: 1px solid #ccc;
			position: relative;
			padding-right: 70px;
		}
		#inputComment{
			width: 100%;
			height: 30px;
			resize: none;
			border: 1px solid #ccc;
			border-radius: 2px;
			padding: 4px 0 4px 6px;
			box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
		}
		.comment-reply{
			position: absolute;
			top: 0;
			right: 23px;
			display: none;
		}
		.comment-reply > i{
			font-size: 14px;
			color: #AAA;
			cursor: pointer;
		}
		.subbox{
			float: left;
			width: 424px;
			margin-left: 10px;
		}
		.subboxWrapper{
			background-color: #fff;
			-moz-box-shadow: 0 0 12px rgba(0,0,0,.1);
			-webkit-box-shadow: 0 0 12px rgba(0,0,0,.1);
			box-shadow: 0 0 12px rgba(0,0,0,.1);
			border-radius: 4px;
			border: 1px solid #dedede;
			margin-bottom: 15px;
		}
		.slide-image-arrow{
			position: absolute;
			top:0;
			width: 60px;
			height: 100%;
			z-index: 3;
			cursor: pointer;
			opacity: .55;
			display: block;
			visibility: hidden;
		}
		.slide-image-arrow:hover{
			opacity: 1;
		}
		.slide-arrow{
			font-size: 50px;
			color: #fff;
			text-shadow: #444 0 1px 1px;
			vertical-align: middle;
			display: table-cell;
		}
		.list-inline > li{
			padding: 0;
		}
		.post_line{
			width: 100%;
			height: 1px;
			background-color: #e4e4e4;
			box-shadow: 0 1px 1px rgba(0,0,0,.06);
		}
		
		#p_update_colorPicker{
			height: 25px;
			margin-bottom: 7px;
		}
		#p_update_colorPicker > div{
			float: left;
			width: 25px;
			height: 25px;
			display: block;
			border: 1px solid #ccc;
			margin-right: 5px;
			margin-bottom: 5px;
			cursor: pointer;
		}
		#p_update_imagePreview > div{
			width: 65px;
			height: 65px;
			float: left;
			border: 1px solid #ccc;
			overflow: hidden;
			margin-right: 6px;
			margin-bottom: 6px;
			padding: 0;
			cursor: move;
			position: relative;
			text-align: center;
		}
		#p_update_imagePreview > div > img{
			width: auto;
			height: 65px;
			vertical-align: top;
		}
		#p_update_imagePreview > div > i{
			position: absolute;
			right: 4px;
			top: 4px;
			cursor: pointer;
			text-shadow: #444 0 1px 1px;
			color: #fff;
			background-color: rgba(0,0,0,0.5);
			padding: 3px;
			border-radius: 4px;
		}
		#p_update_imageUploadBtn{
			width: 65px;
			height: 65px;
			float: left;
			border: 1px solid #ccc;
			position: relative;
			cursor: pointer;
			text-align: center;
			line-height: 50px;
			color: #ccc;
			font-size: 35px;
			overflow: hidden;
			padding: 0;
		}
		#p_update_imageUploadBtn > i{
			font-size: 24px;
		}
		#p_update_imageUploadBtn > input{
			position: absolute;
			top: 0;
			right: 0;
			margin: 0;
			opacity: 0;
			-ms-filter: 'alpha(opacity=0)';
			font-size: 200px;
			direction: ltr;
			cursor: pointer;
		}
		.post-source{
			padding: 6px 12px;
			width: 100%;
			text-overflow: ellipsis;
			white-space: nowrap;
			overflow: hidden;
			font-size: 13px;
		}
		#comment-message{
			position: absolute;
			left: 16px;
			top: 12px;
			color: #c0c0c0;
			opacity : .9;
		}
		.swipe {
			overflow: hidden;
			visibility: hidden;
			position: relative;
		}
		.swipe-wrap {
			height: 100%;
			position: relative;
		}
		.swipe-wrap > div {
			float: left;
			width: 100%;
			position: relative;
			border-radius: 4px;
			overflow: hidden;
		}
		.swipe-wrap > div > a{
			display: block;
			text-align: center;
		}
		.swipe-wrap > div > a > img{
			max-width: 100%;
			height: auto;
		}
		#likemember-list{
			padding-left:0;
			list-style: none;
		}
		#likemember-list li{
			width: 100%;
			position: relative;
			padding: 10px 0;
			border-bottom: 1px solid #eee;
		}
		#likemember-list li:hover{
			background-color: #f8f8f8;
		}
		#likemember-list div > a > img{
			width: 40px;
			height: 40px;
			border-radius: 2px;
		}
		#likemember-list div{
			position: absolute;
			top: 13px;
			left: 0;
		}
		#likemember-list p{
			padding-left: 55px;
		}
		#likemember-list button{
			position: absolute;
			top: 15px;
			right:0;
		}
		#likemember-list .lm-name{
			font-size: 15px;
			color: #527896;
		}
		#likemember-list .lm-id{
			text-decoration: none;
			color: #8f8f8f;
			font-size: 13px;
		}
		#comment-write > .emoji-wysiwyg-editor{
			box-shadow: inset 0 1px 1px rgba(0,0,0,.05)!important;
			-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05)!important;
			padding: 4px 32px 4px 6px!important;
			border: 1px solid #ccc!important;
			border-radius: 2px!important;
			height: 30px!important;
			min-height: 30px!important;
			overflow: hidden!important;
			white-space: nowrap!important;
		}
		#comment-update > .emoji-wysiwyg-editor{
			box-shadow: inset 0 1px 1px rgba(0,0,0,.05)!important;
			-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05)!important;
			padding: 4px 32px 4px 6px!important;
			border: 1px solid #ccc!important;
			border-radius: 2px!important;
			height: 30px!important;
			min-height: 30px!important;
			overflow: hidden!important;
			white-space: nowrap!important;
		}
		.p_update > .emoji-wysiwyg-editor {min-height: 94px;white-space:pre;}
		.hashtag{
			text-decoration: none!important;
			color: #216FAE!important;
		}
		.hashtag:hover{
			font-weight: bold;
		}
		.item-tag a{
			display: inline-block;
			text-decoration: none!important;
			padding: 6px 8px;
			border: 1px solid #216FAE;
			margin-bottom: 6px;
			font-size: 13px;
			color: #216FAE!important;
			-webkit-transition: background-color 0.3s ease-in-out;
			-moz-transition: background-color 0.3s ease-in-out;
			-o-transition: background-color 0.3s ease-in-out;
			transition: background-color 0.3s ease-in-out;
		}
		.item-tag a:hover{
			background-color: #eee;
		}
    </style>
	<link rel="stylesheet" type="text/css" href="/resources/fancyBox/source/jquery.fancybox.css?v=2.1.5" media="screen" />
	<link rel="stylesheet" type="text/css" href="/resources/fancyBox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
	<link rel="stylesheet" type="text/css" href="/resources/fancyBox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
	<script src="/resources/js/jquery-1.11.0.js"></script>
</head>

<body>
<div id="viewport">
<div id="page">
	<!-- header -->
	<%@ include file="head.jsp" %>
	<!-- header -->

	<!-- content -->
	<div class="container content">
		<div style="width: 100%;">
			<div id="itembox">
				<div id="mySwipe" style="width:100%;" class="swipe">
					<div class="swipe-wrap">
						<div><a href="/resources/upload/post/${post.image1}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image1}" onload="$('#itembox').css('height',$(this).height());"></a></div>
						<c:if test="${!empty post.image2}"><div><a href="/resources/upload/post/${post.image2}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image2}" alt=""></a></div></c:if>
						<c:if test="${!empty post.image3}"><div><a href="/resources/upload/post/${post.image3}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image3}" alt=""></a></div></c:if>
						<c:if test="${!empty post.image4}"><div><a href="/resources/upload/post/${post.image4}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image4}" alt=""></a></div></c:if>
						<c:if test="${!empty post.image5}"><div><a href="/resources/upload/post/${post.image5}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image5}" alt=""></a></div></c:if>
						<c:if test="${!empty post.image6}"><div><a href="/resources/upload/post/${post.image6}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image6}" alt=""></a></div></c:if>
						<c:if test="${!empty post.image7}"><div><a href="/resources/upload/post/${post.image7}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image7}" alt=""></a></div></c:if>
						<c:if test="${!empty post.image8}"><div><a href="/resources/upload/post/${post.image8}" rel="gallery" class="fancybox-thumbs" data-fancybox-group="thumb" ><img src="/resources/upload/post/thumbnail/${post.image8}" alt=""></a></div></c:if>
					</div>
				</div>
				<c:if test="${!empty post.image2}">
					<div id="slide-arrow-left" style="padding-left: 15px; left:0;" class="slide-image-arrow" onclick="mySwipe.prev()"><div style="display:table;height:100%"><span class="slide-arrow"><i class="fa fa-chevron-left"></i></span></div></div>
					<div id="slide-arrow-right" style="right:0; padding-left: 10px;" class="slide-image-arrow" onclick="mySwipe.next()"><div style="display:table;height:100%"><span class="slide-arrow"><i class="fa fa-chevron-right"></i></span></div></div>
					<div style="position:absolute; bottom: 20px; left:0;width:100%;text-align:center;">
						<ol class="carousel-indicators" id="image-list" style="margin:0; position: static; width:100%; opacity:.85;">					
							<li class="active" data-index="0"></li>
							<li data-index="1"></li>
							<c:if test="${!empty post.image3}"><li data-index="2"></li></c:if>
							<c:if test="${!empty post.image4}"><li data-index="3"></li></c:if>
							<c:if test="${!empty post.image5}"><li data-index="4"></li></c:if>
							<c:if test="${!empty post.image6}"><li data-index="5"></li></c:if>
							<c:if test="${!empty post.image7}"><li data-index="6"></li></c:if>
							<c:if test="${!empty post.image8}"><li data-index="7"></li></c:if>
						</ol>
					</div>
				</c:if>
			</div>
			<div class="subbox">
				<div class="subboxWrapper">
					<div class="post-profile" style="height: 85px; padding:12px;">
						<div class="profile-img" style="width:56px; float:left;">
	   						<a href="/${post.member_id}"><img src="/resources/upload/profile/thumbnail/${post.profileImage}" width="50px;" height="50px;" style="border-radius: 50%;" title="${post.author}"></a>
	   					</div>
	   					<div class="profile-info" style="margin-left: 60px; margin-top: 3px; ">
	   						<div style="position: relative;">
	   							<div style="margin-bottom: 4px; font-size: 16px; font-weight: bold;"><a href="/${post.member_id}" style="color: #54301a; text-decoration: none;">${post.author}&nbsp;<small style="color: #c8c8c8; font-weight: normal;">@${post.member_id}</small></a></div>
	   						</div>
	   						<div>
	   							<div style="margin:0; color: #aaa; display: block; float:left; font-size: 12px;" id="time_left"></div>
	   							<c:if test="${followState ne 'me'}">
	   								<c:if test="${followState eq 'following'}">
	   									<div style="float: right;"><button type="button" class="btn btn-success btn-sm" onclick="follow(this, 'unFollow', '${post.member_idx}');" title="팔로우" style="width: 80px;"><i class='fa fa-check'></i>&nbsp;팔로잉</button></div>
	   								</c:if>
	   								<c:if test="${followState eq 'unFollow'}">
	   									<div style="float: right;"><button type="button" class="btn btn-default btn-sm" onclick="follow(this, 'follow', '${post.member_idx}');" title="팔로우" style="width: 80px;">팔로우</button></div>
	   								</c:if>
	   							</c:if>
	   						</div>
	   					</div>
	   				</div>
	   				<div class="item-content">
						<p id="post-content" style="word-break: break-all;">${post.content}</p>
					</div>
					<%-- <c:if test="${!empty tags}">
						<div class="item-tag" style="padding:12px;">
							<c:forEach var="tag" items="${tags}">
								<a href="/hashtag/${fn:replace(tag, '&', '%26')}" title="#${tag}">#${tag}</a>
							</c:forEach>
						</div>
					</c:if> --%>
	 				<c:if test="${post.source ne '' and post.source ne null}">
						<div class="post-source">
							<c:if test="${post.group_type eq 'user'}">
								<span>출처 : <a href="${post.source}" target="_blank">${post.source}</a></span>
							</c:if>
							<c:if test="${post.group_type eq 'seller'}">
								<span><a href="http://faeple.com/statistics/buylink?p=${post.idx}&m=${post.member_idx}&url=${post.source}" target="_blank" style="color:#CF5050;text-decoration:none;"><i class="ion-bag" style="font-size:16px;"></i>&nbsp;상품구매 바로가기</a></span>
							</c:if>
						</div>
					</c:if>
					<div class="section-count">
						<c:if test="${like_cnt eq 0}">
							<a>좋아요&nbsp;<strong id="like-cnt">0</strong></a>&nbsp;&nbsp;
						</c:if>
						<c:if test="${like_cnt ne 0}">
							<a href="javascript:showLikeMember(${post.idx})">좋아요&nbsp;<strong id="like-cnt">${like_cnt}</strong></a>&nbsp;&nbsp;
						</c:if>
						&nbsp;&nbsp;<a style="cursor:pointer;" onclick="$('#inputComment').next().focus();">댓글&nbsp;<strong id="comment-cnt">${comment_cnt}</strong></a>
					</div>
	 				<div class="item-function">
	 					<c:if test="${likeState eq 'unlike'}">
							<button type="button" title="좋아요" onclick="like(this, '${post.idx}', '${post.member_idx}', '${post.image1}', '${post.url}', '${fn:escapeXml(post.title)}')"><i class="fa fa-heart" style="font-size: 13px;"></i>&nbsp;좋아요</button>
							
						</c:if>
						<c:if test="${likeState eq 'like'}">
							<button type="button" title="좋아요" style="color:#cc2e35;" onclick="like(this, '${post.idx}', '${post.member_idx}', '${post.image1}', '${post.url}', '${fn:escapeXml(post.title)}')"><i class="fa fa-heart" style="font-size: 13px;"></i>&nbsp;좋아요</button>
						</c:if>
						<button type="button" title="공유하기" data-toggle="modal" data-target="#share-modal"><i class="icon ion-share" style="font-size: 18px;"></i>&nbsp;공유하기</button>
						<button type="button" title="더보기" class="dropdown-toggle" data-toggle="dropdown"><i class="icon ion-more" style="font-size: 18px; cursor: pointer;"></i>&nbsp;더보기</button>
						<ul class="dropdown-menu" role="menu" style="left:75px; box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.22);border:0;font-size:13px;min-width:140px;">
							<li style="position: absolute; top: -14px; right: 14px;"><img src="/resources/img/arrow_small.png"></li>
							<c:if test="${followState ne 'me'}">
								<li><a href="#" onclick="reports(${post.idx},'post')" style="color: #cd2f2f; font-weight: bold;">콘텐츠 신고</a></li>
							</c:if>
							<c:if test="${followState eq 'me'}">
								<li><a href="#" onclick="post_update_init()" style="color: #333; font-weight: bold;">이게시물 수정하기</a></li>
								<li><a href="#" data-toggle="modal" data-target="#delete-modal" style="color: #cd2f2f; font-weight: bold;">이게시물 삭제하기</a></li>
							</c:if>
						</ul>
	 				</div>
					
					<div class="comment-wrapper">
						<div class="post_line"></div>
						<div class="comment-list"><div id="comment-more" onclick="index+=8; getComment();"><i id="comment-more-loading" style="color:#333;font-size:14px;margin-right:8px;display:none;" class="ion-loading-c"></i>이전 댓글 보기</div><div id="item-commentList"></div></div>
						<div id="comment-write"><input id="inputComment" name="inputComment" maxlength="300" placeholder="댓글을 남겨보세요..."><i class="fa fa-smile-o" style="position: absolute;top:12px; right:75px; color: #ccc; font-size: 21px; cursor: pointer; display: none;" title="이모티콘" id="emoji-btn"></i><button type="button" style="display: none; position: absolute; top:8px; right:5px; padding:5px 16px; font-size: 13px; height:30px;" id="comment-submit" class="btn btn-success btn-sm" onclick="submitComment()">전송</button><div id="comment-message"></div></div>				
						<div id="comment-update"><input id="updateComment" maxlength="300" style="width: 100%!important;"><i class="fa fa-smile-o" style="position: absolute;top:13px; right:75px; color: #ccc; font-size: 21px; cursor: pointer;" title="이모티콘" id="emoji-btn2"></i><button type="button" id="commentUpdateBtn" style="position: absolute; top:8px; right:5px; padding:5px 16px; font-size: 13px; height:30px;" class="btn btn-success btn-sm" onclick="comment_update(this)">전송</button></div>					
						<div id="comment-loader" style="text-align: center; padding-bottom: 15px; display: none;"><img src="/resources/img/comment-more.gif"></div>
						<input type="hidden" id="comment-type" name="comment-type" value="default">
					</div>
				</div>
				<div style="width: 100%;height:30px;">
					<div style="float:right; padding-left:8px; width:80px;"><a id="tweet" href="https://twitter.com/share" data-url="" data-text="" class="twitter-share-button" data-lang="ko">Tweet</a></div>
					<div class="fb-like" id="fbLike" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false" data-href="" data-width="480" style="float:right;"></div>
				</div>
			</div>
		</div>
	</div>
	<!-- end container -->
<!-- content -->
<input type="hidden" id="editCommentIdx" name="editCommentIdx">
<!-- reports dialog -->
<div class="modal fade" id="report-modal" tabindex="-1" role="dialog" aria-hidden="true" style="z-index:1100;">
	<div class="modal-dialog" style="max-width: 350px;">
		<div class="modal-content">
			<form id="report-form" method="post">
			<input type="hidden" id="report-idx" name="report-idx">
			<div class="modal-header" style="border-bottom:0;padding-bottom:0;">
		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="font-size: 28px;">×</button>
		        <h4 class="modal-title">신고하기</h4>
			</div>
			<div class="modal-body">
				<div class="form-group">
					<label for="report-type">이 게시물을 신고하는 이유가 무엇인가요?</label>
					<select class="selectpicker show-tick" id="report-type" name="report-type" title="선택" data-width="100%">
						<option value="spam">스팸 및 광고</option>
						<option value="improper">부적절한 주제</option>
						<option value="steal">도용 및 저작권 침해</option>
						<option value="speech">욕설 및 불편한 언어</option>
						<option value="porno">음란성</option>
						<option value="other">기타</option>
					</select> 
				</div>
				<div class="form-group">
					<label for="report-opinion">추가의견</label>
					<textarea id="report-opinion" name="report-opinion" class="form-control" rows="3" cols="250" style="resize:none;"></textarea>
				</div>
			</div>
			<div class="modal-footer" style="border-top:0;margin-top:0;padding:0 15px 15px 15px;">
				<button type="button" class="btn btn-primary btn-lg btn-block" onclick="report_submit(this);">보내기</button>
			</div>
			</form>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- reports dialog -->

<!-- share dialog -->
<div class="modal fade" id="share-modal" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog" style="max-width: 350px;">
		<div class="modal-content">
			<form id="report_form" method="post">
			<input type="hidden" id="report-category" name="report-category">
			<div class="modal-header" style="border-bottom:0;padding-bottom:0;">
		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="font-size: 28px;">×</button>
		        <h4>공유하기</h4>
			</div>
			<div class="modal-body">
				<p>공유할 사이트를 선택 :</p> 
				<ul class="list-inline">
					<li><a href="javascript:fb_share();" title="페이스북으로 공유하기" style="display: block;"><img src="/resources/img/icon/share-facebook-icon.png" width="32px" height="32px"></a></li>
					<li><a href="javascript:twitter_share();" title="트위터로 공유하기" style="display: block;"><img src="/resources/img/icon/share-twitter-icon.png" width="32px" height="32px"></a></li>
					<li><a id="google-share" title="구글플러스로 공유하기" href="#" onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;" style="display: block;"><img src="/resources/img/icon/share-googleplus-icon.png" width="32px" height="32px"></a></li>
					<li><a id="mail-share" href="" target="_blank" title="이메일로 공유하기"><img src="/resources/img/icon/share-email-icon.png" width="32px" height="32px"></a>
					<li><a id="kakao-link-btn" href="javascript:;" title="카카오로 공유하기" style="display: none;"><img width="34px;" height="34px;" src="http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg" style="margin-left:2px;" /></a></li>
				</ul>
				<div>
					<p>또는 포스트 링크 복사</p>
					<input type="text" id="input_urlCopy" class="form-control" readonly="readonly" value="" onclick="this.select();" style="background-color: #fff; cursor: text;">
				</div>
			</div>
			</form>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- share dialog -->

<div class="modal fade" id="likemember-modal" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog" style="max-width: 350px;">
		<div class="modal-content">
			<div class="modal-header" style="border-bottom:0;padding-bottom:0;">
		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="font-size: 28px;">×</button>
		        <h4>좋아하는 사람들</h4>
			</div>
			<div class="modal-body">
				<div id="likemember-list-loading" style="display: none;padding: 25px 0; text-align: center;"><img src="/resources/img/loading-20x20-white.gif"></div>
				<ul id="likemember-list"></ul>
			</div>
		</div>
	</div>
</div>

<c:if test="${post.member_idx eq userDto.idx}">
<!-- delete modal -->
<div class="modal fade" id="delete-modal" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog" style="max-width: 350px;">
		<div class="modal-content">
			<div class="modal-header" style="border-bottom:0;padding-bottom:0;">
<!-- 		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="font-size: 28px;">×</button> -->
		        <h4 style="margin:6px 0;">이 게시물을 정말로 삭제할까요?</h4>
		        <span style="color: #777; padding-top:4px; font-size: 12px;">삭제한 게시물은 복구가 불가능합니다</span>
		        <div style="margin-top:5px;text-align: right; padding: 15px 0;">
		        	<button type="button" class="btn btn-success btn-sm" onclick="post_delete(this, ${post.idx})">확인</button>
		        	<button type="button" class="btn btn-default btn-sm" data-dismiss="modal" aria-hidden="true">취소</button>
		        </div>
		        
			</div>
		</div>
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- 글쓰기 수정창 -->
<div class="modal fade" id="update-modal" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog" style="max-width: 710px; margin:30px auto;">
		<div class="modal-content">
			<div class="modal-header" style="border-bottom:0;padding-bottom:0;">
		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="font-size: 28px;">×</button>
		        <h4 class="modal-title">수정하기</h4>
			</div>
			<div class="modal-body" style="padding-bottom: 0;">
			<form id="update-form" method="post" action="/postUpdate">
				<input type="hidden" id="p_update_idx" name="p_update_idx" value="${post.idx}">
				<input type="hidden" class="update_currentposition" id="p_update_image1" name="p_update_image1" value="${post.image1}">
				<input type="hidden" class="update_currentposition" id="p_update_image2" name="p_update_image2" value="${post.image2}">
				<input type="hidden" class="update_currentposition" id="p_update_image3" name="p_update_image3" value="${post.image3}">
				<input type="hidden" class="update_currentposition" id="p_update_image4" name="p_update_image4" value="${post.image4}">
				<input type="hidden" class="update_currentposition" id="p_update_image5" name="p_update_image5" value="${post.image5}">
				<input type="hidden" class="update_currentposition" id="p_update_image6" name="p_update_image6" value="${post.image6}">
				<input type="hidden" class="update_currentposition" id="p_update_image7" name="p_update_image7" value="${post.image7}">
				<input type="hidden" class="update_currentposition" id="p_update_image8" name="p_update_image8" value="${post.image8}">
				<input type="hidden" value="${post.color}" id="p_update_color" name="p_update_color">
				<input type="hidden" id="p_update_tag" name="p_update_tag">
				<div class="form-group p_update" style="position: relative;">
					<label for="p_update_content"><spring:message code="post.upload.description" text="설명" /></label><span id="p_update_content-length" style="margin-left:15px; font-size: 12px; color: #ccc;display:none;">0</span><span style="font-size: 12px; color: #ccc;display:none;">/400</span>
					<textarea class="form-control expand" rows="5" id="p_update_content" name="p_update_content" style="resize:none;" maxlength="399" placeholder="설명을 입력해 주세요" onkeydown="remain_update_Content();">${update_content}</textarea>
					<input type="hidden" id="p_update_tagUser" name="p_update_tagUser" value="">
					<i class="fa fa-smile-o" style="position: absolute;bottom:5px; right:5px; color: #ccc; font-size: 21px; cursor: pointer;" title="<spring:message code="common.emoticon"/>" id="update-emoji-btn"></i>
				</div>
				<div class="form-group">
					<c:if test="${userDto.group_type eq 'user'}">
						<label for="inputSource"><spring:message code="post.upload.source"/></label>
					</c:if>
					<c:if test="${userDto.group_type eq 'seller'}">
						<label for="inputSource"><spring:message code="post.upload.buylink"/></label>
					</c:if>
					<input class="form-control" type="text" id="p_update_source" name="p_update_source" placeholder="<spring:message code="post.upload.source_ph"/>" maxlength="100" value="${post.source}">
				</div>
				<div class="form-group">
					<label><spring:message code="post.upload.category" text="카테고리" /></label><br>
					<select class="selectpicker show-tick" id="p_update_category" name="p_update_category" title="<spring:message code="post.upload.category" text="카테고리" />" data-width="160px">
						<option value="w_clothes"><spring:message code="categoryView.w_clothes" text="여성의류" /></option>
						<option value="w_footwear"><spring:message code="categoryView.w_footwear" text="여성신발" /></option>
						<option value="w_bag"><spring:message code="categoryView.w_bag" text="여성가방" /></option>
						<option value="w_accessory"><spring:message code="categoryView.w_accessory" text="여성악세사리" /></option>
						<option value="w_beauty"><spring:message code="categoryView.w_beauty" text="여성뷰티" /></option>
					</select>
					<label title="<spring:message code="common.women" text="여성" />" style="margin-left:10px;"><input type="radio" name="p_update_gender" id="p_update_gender" value="womens" checked="checked"><span class="input-label-text"><spring:message code="common.women" text="여성" /></span></label>
					<label title="<spring:message code="common.men" text="남성" />"><input type="radio" name="p_update_gender" id="p_update_gender" value="mens"><span class="input-label-text"><spring:message code="common.men" text="남성" /></span></label>
				</div>
				<%-- <div class="form-group">
					<p><strong>색상</strong></p>
					<div id="p_update_colorPicker">
						<input type="hidden" value="${post.color}" id="p_update_color" name="p_update_color">
						<div title="검정" data-color="black" style="background-color:black;"></div>
						<div title="흰색" data-color="white" style="background-color:white;"></div>
						<div title="파랑" data-color="blue" style="background-color:blue;"></div>
						<div title="하늘" data-color="skyblue" style="background-color:skyblue;"></div>
						<div title="노랑" data-color="yellow" style="background-color:yellow;"></div>
						<div title="빨강" data-color="red" style="background-color:red;"></div>
						<div title="회색" data-color="gray" style="background-color:gray;"></div>
						<div title="베이지" data-color="beige" style="background-color:beige;"></div>
						<div title="녹색" data-color="green" style="background-color:green;"></div>
						<div title="브라운" data-color="brown" style="background-color:brown;"></div>
						<div title="보라" data-color="purple" style="background-color:purple;"></div>
						<div title="핑크" data-color="hotPink" style="background-color:HotPink;"></div>
						<div title="민트" data-color="mint" style="background-color:MediumAquaMarine"></div>
					</div>
				</div> --%>
				<!-- <div class="form-group">
					<label for="p_update_tag">태그</label>
					<input class="form-control" type="text" id="p_update_tag" name="p_update_tag" placeholder="태그와 태그는 쉼표로 구분해주세요">
				</div> -->
				<div class="form-group">
					<p><strong><spring:message code="post.upload.privacy" text="공개여부" /></strong></p>
					<label title="<spring:message code="post.upload.privacy_all" text="모두" />"><input type="radio" name="p_update_privacy" id="p_update_privacy" value="2"><span class="input-label-text"><spring:message code="post.upload.privacy_all" text="모두" /></span></label>
					<label title="<spring:message code="post.upload.privacy_follower" text="팔로워만" />"><input type="radio" name="p_update_privacy" id="p_update_privacy" value="1"><span class="input-label-text"><spring:message code="post.upload.privacy_follower" text="팔로워만" /></span></label>
					<label title="<spring:message code="post.upload.privacy_me" text="나만보기" />"><input type="radio" name="p_update_privacy" id="p_update_privacy" value="0"><span class="input-label-text"><spring:message code="post.upload.privacy_me" text="나만보기" /></span></label>
				</div>
			</form>
			</div>
			
			<form id="update-img-form" method="post" enctype="multipart/form-data" action="/imgUpload">
				<div class="form-group" style="padding-left:15px;">
					<label><spring:message code="post.upload.photo" text="사진" /></label><span style="font-size: 12px; margin-left: 5px; color: #ccc;">(<span id="p_update_uploadImageSize">0</span>/8)</span>
					<div class="imageUpload">
						<div id="p_update_imagePreview">
							<div data-index="1"><img src="/resources/upload/post/${post.image1}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						<c:if test="${!empty post.image2}">
							<div data-index="2"><img src="/resources/upload/post/${post.image2}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						<c:if test="${!empty post.image3}">
							<div data-index="3"><img src="/resources/upload/post/${post.image3}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						<c:if test="${!empty post.image4}">
							<div data-index="4"><img src="/resources/upload/post/${post.image4}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						<c:if test="${!empty post.image5}">
							<div data-index="5"><img src="/resources/upload/post/${post.image5}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						<c:if test="${!empty post.image6}">
							<div data-index="6"><img src="/resources/upload/post/${post.image6}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						<c:if test="${!empty post.image7}">
							<div data-index="7"><img src="/resources/upload/post/${post.image7}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						<c:if test="${!empty post.image8}">
							<div data-index="8"><img src="/resources/upload/post/${post.image8}"><i class="fa fa-times" title="삭제" onclick="update_uploadImgTrash(this)"></i></div>
						</c:if>
						</div>			
						<div id="p_update_imageUploadBtn" title="여기를 클릭해 사진을 추가하세요"><i class="icon ion-images"></i><input type="file" id="p_update_images" name="p_update_images" onchange="p_update_imagePreview(this)" accept="image/*" multiple="multiple"></div>
					</div>
				</div>
			<div class="modal-footer" style="border-top:0;margin-top:0;padding:0 15px 15px 15px;">
				<button type="button" class="btn btn-primary btn-lg btn-block" onclick="postUpdate()" id="postUpdateBtn">수정하기</button>
				<input type="submit" class="btn btn-success btn-lg btn-block" id="p_update_catchImgUploadBtn" style="display: none;" value="이미지 업로드">
			    <div class="progress progress-striped active" id="update_progressBar" style="display: none; height: 45px;">
					<div class="progress-bar" role="progressbar" aria-valuemax="100" style="width: 0%"></div>
				</div>
			</div>
			</form>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</c:if>

</div><!-- end page -->
<%@ include file="commonScript.jsp" %>
</div><!-- end viewport -->
<script type="text/javascript" src="/resources/js/jquery.mousewheel-3.0.6.pack.js"></script>
<script type="text/javascript" src="/resources/fancyBox/source/jquery.fancybox.js?v=2.1.5"></script>
<script type="text/javascript" src="/resources/fancyBox/source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="/resources/fancyBox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<script type="text/javascript" src="/resources/fancyBox/source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<script type="text/javascript" src="/resources/js/imagesloaded.pkgd.min.js"></script>
<script type="text/javascript" src="/resources/js/swipe.js"></script>
<script type="text/javascript" src="/resources/js/jquery.slimscroll.min.js"></script>
<script type="text/javascript">
	var member_idx = "${userDto.idx}";
	var member_name = "${userDto.name}";
	var member_id = "${userDto.id}";
	var index = 0;
	var loadComment_cnt = 0;
	var comment_cnt = "${comment_cnt}";
	var post_idx = "${post.idx}";
	var createDate = "${post.createdate}";
	var likeMemberIndex = 0;
   	
	var elem = document.getElementById("mySwipe");
	window.mySwipe = Swipe(elem, {
		callback: function(index, elem){
			$("#itembox").css("height", $(elem).height());
			$("#image-list").children("li").each(function(){
				$(this).removeClass("active");
			});
			$("#image-list").children("li").siblings(":nth-child("+(index+1)+")").addClass("active");
		} // transitionEnd: function(index, element) {}
	});
	
	
    $(function(){
    	if(isMobile()){
    		$(".slide-image-arrow").hide();
    		$("#kakao-link-btn").show();
    	}
    	
    	if(comment_cnt == 0) {
   			$("#comment-message").html("가장먼저 댓글을 남겨보세요..");
   		}else{
   			getComment();
   			$("#comment-message").html("댓글을 남겨보세요..");
   		}
    	
    	$("#time_left").html(timeleft("${post.createdate}"));
    	$("#post-content").html(parseContent($("#post-content").html()).parseEmoji());
  		
  		$("#inputComment").emojiarea({wysiwyg: true, button: '#emoji-btn'});
  		$("#updateComment").emojiarea({wysiwyg: true, button: '#emoji-btn2'});
    		
   		$("#inputComment").click(function(){
   			if(member_idx == ""){
   				$("#login-dialog").modal("show");
   			}
   		});
   		$("#comment-message").click(function(){
   			if(member_idx == ""){
   				$("#login-dialog").modal("show");
   			}else{
   				$(this).hide();
   				$("#comment-write > div.emoji-wysiwyg-editor").focus();
   				$("#comment-submit").show();
   				$("#emoji-btn").show();
   				$("#comment-write").css({"padding-right":"70px"});
   			}
   		});
   		$("#comment-write > div.emoji-wysiwyg-editor").click(function(){
   			if(member_idx == ""){
   				$("#login-dialog").modal("show");
   			}else{
   				$("#comment-submit").show();
   				$("#emoji-btn").show();
   				$("#comment-write").css({"padding-right":"70px"});
   				$("#comment-message").hide();
   			}
   		}).keydown(function(e){
   			/* if(e.keyCode == 50){
   				alert('d');
   			} */
   		});
   		
   		$(".fancybox-thumbs").fancybox({
   			padding: 0,
   			nextClick : true,
   			"type" : "image",
   			helpers : {
   				thumbs : {width:50,height:50}
			}
		});
    	
   		$("#image-list > li").click(function(){
   			$("#image-list > li").each(function(){
   				$(this).removeClass("active");
   			});
   			mySwipe.slide($(this).index(), 300);
   			$(this).addClass("active");
   		});
   		
   		var users = [];
   		<c:forEach items="${followingList}" var="user">
   			users.push({"name":"${user.name}","username":"${user.id}","image":"/resources/upload/profile/thumbnail/${user.profileImage}"});
		</c:forEach>
   		
   		//mention
   		$("#inputComment").mention({
   			sensitive: true,
			users: users
		});
   		
   		$("#fbLike").attr("href", window.location.href);
   		$("#tweet").data("url", window.location.href).data("text", "${fn:escapeXml(post.title)}");
   		
		$("#report-type").selectpicker();
		$("#input_urlCopy").val(location.href);
		
		$("#mail-share").attr("href", "mailto:?subject=${fn:escapeXml(post.title)}&body=${fn:escapeXml(post.content)}%0D%0AURL : "+location.host+"/p/${post.url}");
		$(".post-source").find("a").attr("href", sourceCheck($(".post-source").find("a").attr("href")));
		
		<c:if test="${post.member_idx eq userDto.idx}">
		
		$("#p_update_category").selectpicker();
		$("input:radio[name=p_update_gender]").on("ifChecked", function(){
  			if(this.value == "womens"){
  				$("#p_update_category").children("option").eq(0).html("여성의류").val("w_clothes").next().html("여성신발").val("w_footwear").next().html("여성가방").val("w_bag").next().html("여성악세사리").val("w_accessory").next().html("여성뷰티").val("w_beauty");
  				$("#p_update_category").selectpicker('refresh');
  			}else{
  				$("#p_update_category").children("option").eq(0).html("남성의류").val("m_clothes").next().html("남성신발").val("m_footwear").next().html("남성가방").val("m_bag").next().html("남성악세사리").val("m_accessory").next().html("남성뷰티").val("m_beauty");
  				$("#p_update_category").selectpicker('refresh');
  			}
  		});
		
		$("#p_update_imagePreview").sortable({
  			placeholder: "ui-state-highlight",
  			revert: true,
  			zIndex: 9999,
  			start: function(e, ui) {
  		        $(this).attr('data-previndex', ui.item.index()+1);
  		    },
			update: function(e, ui) {
				var newIndex = ui.item.index()+1;
				var oldIndex = parseInt($(this).attr('data-previndex'));
				$(this).removeAttr('data-previndex');
				
				var temp2 = $("#p_update_image"+newIndex).val();
				$("#p_update_image"+newIndex).val($("#p_update_image"+oldIndex).val());
				
				if(newIndex < oldIndex){ //<<<<<
					if(oldIndex-newIndex == 1){
						$("#p_update_image"+oldIndex).val(temp2);
					}else{
						var total = oldIndex-newIndex;
						for(var i=0;i<total;i++){
							if(i == total-1){
								$("#p_update_image"+(oldIndex-i)).val(temp2);
							}else{
								$("#p_update_image"+(oldIndex-i)).val($("#p_update_image"+(oldIndex-i)).prev().val());
							}
						}
					}
					
				}else{ //>>>
					if(newIndex-oldIndex == 1){
						$("#p_update_image"+oldIndex).val(temp2);
					}else{
						var total = newIndex-oldIndex;
						for(var i=0;i<total;i++){
							if(i == total-1){
								$("#p_update_image"+(oldIndex+i)).val(temp2);
							}else{
								$("#p_update_image"+(oldIndex+i)).val($("#p_update_image"+(oldIndex+i)).next().val());
							}
							
						}
					}
					
				}
				
			}
  		});

  		$("#p_update_imagePreview").disableSelection();
  		
  		/* $("#p_update_colorPicker div").click(function(){
  			$("#p_update_colorPicker div").each(function(){
  				$(this).empty();
  			});
  			if($(this).data("color") == "white" || $(this).data("color") == "yellow" || $(this).data("color") == "beige"){
  				$(this).html("<i class='fa fa-check' style='color:#000; font-size:16px;'></i>");
  			}else{
  				$(this).html("<i class='fa fa-check' style='color:#fff; font-size:16px;'></i>");
  			}
  			$("#p_update_color").val($(this).data("color"));
  		}); */
  		
  		$("#p_update_content").emojiarea({wysiwyg: true, button: '#update-emoji-btn', 'setClass':'write'});
  		
		</c:if>
		
   	}); // end document
    
   	$('body').tooltip({
   	    selector: '[data-btn="fn"]',
   	    'container': 'body'
   	});
   	
   	$(document).click(function(e){
        if ($(e.target).parents(".comment-wrapper").size() == 0 && $("#comment-write > div.emoji-wysiwyg-editor").is(":empty")) {
        	$("#comment-submit").hide();
			$("#emoji-btn").hide();
			$("#comment-write").css({"padding-right":"8px"});
			if($("#comment-write > div.emoji-wysiwyg-editor").is(":empty")) $("#comment-message").show();
        }
	});
   	
   	$(document).on("keyup","#comment-update > div.emoji-wysiwyg-editor", function(e){
   		if(e.keyCode ==27){
   			$("#comment-update").fadeOut(function(){ 
   				$("#comment-write").show();
   				$("#comment-submit").hide();
   				$("#emoji-btn").hide();
   			});
   		}
   	});
   	
   	function showLikeMember(idx){
   		$("#likemember-list").empty();
   		$("#likemember-modal").modal("show");
		$.ajax({
			type : "post"
		    , url : "/getPostLikeMemberList?post_idx="+idx+"&index="+likeMemberIndex+"&loadSize=40"
		    , dataType : "json"
		    , timeout : 5000
		  	, error : function() {
	  			$("#likemember-list").html("<li style='text-align:center;'>불러올 수 없습니다</li>");
		    }
		    , success : function(response) {
		    	var html = "";
		    	for(var i=0;i<response.length;i++){
		    		html += "<li><div><a href='/"+response[i].member_id+"' target='_blank'><img src='/resources/upload/profile/thumbnail/"+response[i].profileImage+"'></a></div><p><a target='_blank' class='lm-name' href='/"+response[i].member_id+"'>"+response[i].member_name+"</a><br><a target='_blank' class='lm-id' href='/"+response[i].member_id+"'>@"+response[i].member_id+"</a></p>";
		    		if(response[i].followState == "unFollow"){
		    			html += "<button type='button' class='btn btn-default btn-sm' onclick='follow(this, \"follow\", "+response[i].member_idx+")'>팔로우</button></li>";
		    		}else if(response[i].followState == "following"){
		    			html += "<button type='button' class='btn btn-success btn-sm' onclick='follow(this, \"unfollow\", "+response[i].member_idx+")'><i class='fa fa-check'></i>&nbsp;팔로잉</button></li>";
		    		}else{
		    			html += "</li>";
		    		}
		    	}
		    	$("#likemember-list").append(html);
		    }, beforeSend: function() {
		    	$("#likemember-list-loading").show();
		    }, complete : function(){
		    	$("#likemember-list-loading").hide();
		    }
		});
   	}
   	
   	function getComment(){
   		$.ajax({
   			type : "post"
		    , url : "/getCommentWithPost?post_idx="+post_idx+"&index="+index+"&order=createdate"
		    , dataType : "json"
		    , timeout : 5000
		    , error : function() {
		    	$("#item-commentList").append("<div style='text-align:center;'><i class='glyphicon glyphicon-remove' style='color:#BF0000;'></i>&nbsp;댓글을 가져올 수 없습니다.</div>");
		    }
		    , success : function(data) {
		    	var comm = "";
		    	for(var i=data.length-1;i>-1;i--){
	    			comm += "<div class='comment' data-idx='"+data[i].idx+"' data-memidx='"+data[i].member_idx+"'><div class='comment-profileImage'><a href='/"+data[i].member_id+"' target='_blank'><img src='/resources/upload/profile/thumbnail/"+data[i].profileImage+"'></a></div><div class='comment-info'><span class='comment-author'><a href='/"+data[i].member_id+"' target='_blank' class='userLink' style='font-weight:bold;'>"+data[i].author+"</a></span><span class='comment-time'>"+timeleft(data[i].create_date)+"</span><div class='comment-content' data-content='"+data[i].content+"'>"+parseContent(data[i].content).parseEmoji()+"</div></div>";
	    			if("${userDto.idx}" == data[i].member_idx){
	    				comm += "<div class='comment-edit dropdown'><i class='glyphicon glyphicon-pencil' data-btn='fn' data-toggle='dropdown' title='수정 및 삭제'></i><ul class='dropdown-menu cmt-dropdown'><li onclick='comment_update_init(this, "+data[i].idx+")'>수정하기</li><li onclick='comment_del(this, "+data[i].idx+")' style='color:#cd2f2f;'>삭제하기</li></ul></div></div>";
	    			}else{
	    				comm += "<div class='comment-report'><i class='fa fa-flag' data-btn='fn' title='신고하기' onclick='report("+data[i].idx+",\"comment\" )' /></div><div class='comment-reply'><i class='fa fa-reply' data-btn='fn' title='답변하기' onclick='commentReply(\""+data[i].member_id+"\")' /></div></div>";
	    			}
	    			loadComment_cnt++;
		    	}
		    	if(loadComment_cnt == comment_cnt){
	    			$("#comment-more").hide();
	    		}else{
	    			$("#comment-more").show();
	    		}
		    	$("#item-commentList").prepend(comm);
		    	//alert($(".comment-list").innerHeight());
		    }
   		});
   	}
    	
   	String.prototype.parseTagUser = function() {
   		hashpattern = /(@[A-Za-z0-9-_]+)/g;
   		return this.match(hashpattern);
   	};
   
   	function sourceCheck(url){
		if (!/^http:\/\//.test(url)) {
	        return "http://" + url;
	    }else{
	    	return url;
	    }
	}
   	
   	function submitComment(){
   		var tagUser = $("#inputComment").val().parseTagUser();
   		if(tagUser != null) tagUser = tagUser.toString();
   		var data = "post_idx="+post_idx+"&content="+$("#inputComment").val()+"&author_idx=${post.member_idx}&refer_img=${post.image1}&refer_url=${post.url}&tagUser="+tagUser+"&comment-type="+$("#comment-type").val();
   		var name = "${userDto.name}";
   		var id = "${userDto.id}";
   		if(!member_idx){
   			alertShow("danger","로그인이 필요합니다", 2000);
   		}else{
   			if($("#inputComment").val() != ""){
   				$.ajax({
       				type : "get"
       			    , url : "/submitComment"
       			    , data : data
       			    , dataType : "text"
       			    , timeout : 5000
       			  	, error : function() {
       			  		alertShow("danger","다시 시도해주세요", 2000);
       			    }
       			    , success : function(response) {
       			    	if(response != "role" && response != "tag"){
       			    		$("#item-commentList").append("<div class='comment' data-idx='"+response+"' data-memidx='${userDto.idx}'><div class='comment-profileImage'><a href='/${userDto.id}'><img src='/resources/upload/profile/thumbnail/${userDto.profileImage}'></a></div><div class='comment-info'><span class='comment-author'><a href='/${userDto.id}' class='userLink' style='font-weight:bold;'>${userDto.name}</a></span><span class='comment-time'>방금전</span><div class='comment-content' data-content='"+$("#inputComment").val()+"'>"+parseContent($("#inputComment").val()).parseEmoji()+"</div></div><div class='comment-edit dropdown'><i class='glyphicon glyphicon-pencil' data-btn='fn' data-toggle='dropdown' title='수정 및 삭제'></i><ul class='dropdown-menu cmt-dropdown'><li onclick='comment_update_init(this, "+response+")'>수정하기</li><li onclick='comment_del(this, "+response+")' style='color:#cd2f2f;'>삭제하기</li></ul></div></div>");
       			    		$("#inputComment").val("").next().empty();
       			    		alertShow("success","댓글이 작성되었습니다", 2000);
       			    		$("#comment-cnt").html(parseInt($("#comment-cnt").html())+1);
       			    	}else if(response == "role"){
       			    		alertShow("danger","로그인이 필요합니다", 2000);
       			    	}else if(response == "tag"){
       			    		alertShow("info","상대방 태그가 잘못되었습니다<br>아이디를 확인해 주세요", 6000);
       			    	}
       			    	$("#comment-type").val("default");
       			    }
       			});
   			}else{
   				alertShow("danger","내용을 입력해 주세요", 2000);
   			}
   		}
   	}
    	
   	function commentReply(id){
   		$("#comment-write > div.emoji-wysiwyg-editor").html("@"+id+" ").focus();
   		$("#comment-submit").show();
		$("#emoji-btn").show();
		$("#comment-write").css({"padding-right":"70px"});
		$("#comment-message").hide();
   		$('html, body').animate({scrollTop:$("#comment-write > div.emoji-wysiwyg-editor").offset().top},500);
   		$("#comment-type").val("reply");
   	}
    	
   	function like(button, post_idx, author_idx, refer_img, refer_url, author_id){
   		if(!member_idx){
   			alertShow("danger","로그인이 필요합니다", 2000);
   		}else{
   			var data = "post_idx="+post_idx+"&author_idx="+author_idx+"&refer_img="+refer_img+"&refer_url="+refer_url+"&author_id="+author_id;
           	$.ajax({
                type: "post",
                url: "/addLike",
                data: data,
                dataType: "text",
                timeout: 5000,
                error: function () {
                    alertShow("danger", "다시 시도해주세요", 2000);
                },
                success: function (response) {
                    if(response == "unlike"){
                    	$(button).css("color","#555");
                    	$("#like-cnt").html(parseInt($("#like-cnt").html())-1);
                    }else if(response == "execute"){
                    	$(button).css("color","#cc2e35");
                    	$("#like-cnt").html(parseInt($("#like-cnt").html())+1);
                    }else{
                        alert('잘못된 접근입니다');
                    }
                }
            });
   		}
   	}
   	
   	function reports(idx, type){
   		if(type=="comment"){
   			$("#report-type").prev().html("이 댓글을 신고하는 이유가 무엇인가요?");
   			$("#report-category").val("comment");
   		}else{
   			$("#report-type").prev().html("이 게시물을 신고하는 이유가 무엇인가요?");
   			$("#report-category").val("post");
   		}
   		$("#report-modal").modal("show");
   	}
    	
   	function comment_del(el, idx){
   		if(confirm('정말로 삭제할까요?')){
   			$.ajax({
       			type : "post"
   			    , url : "/commentDelete?comment_idx="+idx
   			    , dataType : "text"
   			    , timeout : 5000
   			    , error : function() {
   			    	alertShow("danger","다시 시도해주세요", 2000);
   			    }
   			    , success : function(response) {
   			    	if(response == "execute"){
   			    		$(el).closest(".comment").remove();
   			    		$("#comment-cnt").html(parseInt($("#comment-cnt").html())-1);
   			    		alertShow("success","삭제되었습니다", 2000);
   			    		comment_cnt--;
   			    	}else if(response == "fail"){
   			    		alertShow("danger","다시 시도해주세요", 2000);
   			    	}else{
   			    		location.href='/warning.jsp';
   			    	}
   			    }
       		});
   		}
   	}
    
   	function comment_update_init(el, idx){
   		$("#editCommentIdx").val(idx);
   		$("#comment-update").show();
   		$("#updateComment").next().html($(el).closest(".comment").find(".comment-content").data("content")).attr("title", "수정을 취소하려면 ESC키를 눌러주세요").attr("data-btn","fn");
   		$("#comment-write").hide();
   	}
   	
   	function comment_update(){
   		var data = "comment_idx="+$("#editCommentIdx").val()+"&content="+$("#updateComment").val();
   		$.ajax({
   			type : "post"
		    , url : "/commentUpdate"
		   	, data : data
		    , dataType : "text"
		    , timeout : 5000
		    , error : function() {
		    	alertShow("danger","다시 시도해 주세요", 2000);
		    }
		    , success : function(response) {
		    	if(response == "execute"){
		    		$("#item-commentList > .comment").each(function(){
		    			if($(this).data("idx") == $("#editCommentIdx").val()){
		    				$(this).children(".comment-info").children(".comment-content").html(parseContent($("#updateComment").val()).parseEmoji());
       			    		$("#updateComment").val("");
       			    		$("#inputComment").val("").next().empty();
       			    		$("#comment-update").hide();
       			    		$("#comment-write").show();
		    			}
   			    	});
		    		alertShow("success","수정되었습니다", 2000);
		    	}else if(response == "fail"){
		    		alertShow("danger","다시 시도해주세요", 2000);
		    	}else{
		    		location.href='/warning.jsp';
		    	}
		    }
		    , beforeSend: function() {
		    	$("#commentUpdateBtn").attr("disabled","disabled");
		    }
		    , complete: function() {
		    	$("#commentUpdateBtn").removeAttr("disabled","disabled");
		    }
   		});
   	}
    	
   	function follow(obj, type, idx) {
        if(member_idx == ""){
            $("#login-dialog").modal("show");
        }else{
            var data = "following_idx="+idx;
            if (type == "follow") {
            	$(obj).html("<i style='color:#333;font-size:14px;' class='ion-loading-c'></i>");
            	setTimeout(function(){
            		$.ajax({
	                    type: "post",
	                    url: "/follow",
	                    data: data,
	                    dataType: "text",
	                    timeout: 5000,
	                    error: function () {
	                        alertShow("danger", "다시 시도해주세요", 2000);
	                        $(obj).html("팔로우");
	                    },
	                    success: function (response) {
	                        if (response == "success") {
	                            $(obj).removeClass("btn-default").addClass("btn-success").html("<i class='fa fa-check'></i>&nbsp;팔로잉").attr("onclick", "follow(this, 'unfollow' , "+idx+");").hide().fadeIn();
	                        } else if (response == "closed") {
	                            alertShow("danger", "팔로우를 받지 않는 사용자입니다", 2000);
	                        } else if (response == "role") {
	                            alertShow("danger", "로그인이 필요합니다", 2000);
	                        } else {
	                            alertShow("danger", "다시 시도해주세요", 2000);
	                        }
	                    },
	                    complete: function(){
	                    	
	                    }
	                });
            	}, 500);
            } else {
            	$(obj).html("<i style='color:#fff;font-size:14px;' class='ion-loading-c'></i>");
            	setTimeout(function(){
            		$.ajax({
	                    type: "post",
	                    url: "/unFollow",
	                    data: data,
	                    dataType: "text",
	                    timeout: 5000,
	                    error: function () {
	                        alertShow("danger", "다시 시도해주세요", 2000);
	                        $(obj).html("<i class='fa fa-check'></i>&nbsp;팔로잉");
	                    },
	                    success: function (response) {
	                        if (response == "fail") {
	                            alertShow("danger", "다시 시도해주세요", 2000);
	                        } else {
	                            $(obj).removeAttr("data-state").removeClass("btn-success").addClass("btn-default").attr("onclick", "follow(this, 'follow', "+idx+");").html("팔로우").hide().fadeIn();
	                        }
	                    }
	                });
            	}, 500);
            }
        }
    }
    
   	function fb_share(){
   		var content = "${fn:escapeXml(post.content)}";
   		if(content.length > 100){
   			content = content.substring(0, 97);
   			content += "...";
   		}
   		var obj = {
   			method: "feed",
   			link: location.href,
   			picture: location.host+"/resources/upload/post/thumbnail/${post.image1}",
   			name: "${fn:escapeXml(post.title)}",
   			caption: location.href,
   			description: content
   		};
   		
   		function callback(response){
   			if(response && response.post_id){
   				alertShow("info","페이스북에 공유되었습니다",2000);
   				$("#share-modal").modal("hide");
   			}
   		}
   		FB.ui(obj, callback);
   	}
   	
   	function twitter_share(){
   		var content = "Faeple on Style : "+ location.href;
   		var link = "https://twitter.com/intent/tweet?text="+content+"&url="+location.href;
   		window.open(link,'트위터로 공유하기','scrollbars=no,toolbar=no,resizable=yes,width=600,height=260');
   	}
   	
   	function report_submit(obj){
		$(obj).html("전송중...").attr("disabled", "disabled");
		setTimeout(function(){
			$.ajax({
				type : "post"
			    , url : "/reportPost"
			    , dataType : "text"
			    , data : $("#report-form").serialize()
			    , timeout : 5000
			  	, error : function() {
			  		alertShow("danger", "다시 시도해주세요" ,2000);
			    }
			    , success : function(response) {
			    	if(response){
			    		alertShow("success", "신고되었습니다" ,2000);
			    	}else{
			    		alertShow("danger", "다시 시도해주세요" ,2000);
			    	}
			    	$("#report-modal").modal("hide");
			    }
			 	, complete: function(){
			 		$(obj).html("보내기").removeAttr("disabled");
			 		$("#report-form")[0].reset();
			 	}
			});
		}, 800);
   	}
   	
   	Kakao.Link.createTalkLinkButton({
   		container: "#kakao-link-btn",
   		label: "Faeple on Style : ${fn:escapeXml(post.title)}",
   		image: {
   			src: "http://faeple.com/resources/upload/post/thumbnail/${post.image1}",
   			width: "300",
   			height: "200"
   		},
   		webButton: {
   			text: "Faeple.com 이동",
   			url: location.href
   		}
   	});
   	
   	<c:if test="${post.member_idx eq userDto.idx}">
   	
   	function post_delete(obj, idx){
   		$.ajax({
			type : "post"
		    , url : "/post_delete?post_idx="+idx
		    , dataType : "text"
		    , timeout : 5000
		  	, error : function() {
		  		alertShow("danger", "다시 시도해주세요" ,2000);
	    		$(obj).removeAttr("disabled", "disabled").html("확인");
		    }
		    , success : function(response) {
		    	if(response == "execute"){
		    		alertShow("success", "삭제되었습니다" ,2000);
		    		setTimeout(function(){
		    			location.href='/';
		    		},2000);
		    	}else{
		    		location.href='/hack';
		    	}
		    }
		 	, beforeSend: function() {
		 		$(obj).attr("disabled", "disabled").html("처리중...");
		 	}
		});
   	}
   	
   	function post_update_init(){
   		/* $("#p_update_colorPicker").children("div").each(function(){
   			if($(this).data("color") == "${post.color}"){
   				if($(this).data("color") == "white" || $(this).data("color") == "yellow" || $(this).data("color") == "beige"){
   	  				$(this).html("<i class='fa fa-check' style='color:#000; font-size:16px;'></i>");
   	  			}else{
   	  				$(this).html("<i class='fa fa-check' style='color:#fff; font-size:16px;'></i>");
   	  			}
   			}
   		}); */
   		if("${post.gender}" == "mens"){
   			$("input:radio[id='p_update_gender']:radio[value='mens']").attr("checked", true);
   			$("#p_update_category").children("option").eq(0).html("<spring:message code='categoryView.m_clothes' />").val("m_clothes").next().html("<spring:message code='categoryView.m_footwear' />").val("m_footwear").next().html("<spring:message code='categoryView.w_bag' />").val("m_bag").next().html("<spring:message code='categoryView.m_accessory' />").val("m_accessory").next().html("<spring:message code='categoryView.m_beauty' />").val("m_beauty");
			$("#p_update_category").selectpicker('refresh');
   		}
   		if("${post.privacy}" == "2"){
   			$("input:radio[id='p_update_privacy']:radio[value='2']").attr("checked",true);
   		}else if("${post.privacy}" == "1"){
   			$("input:radio[id='p_update_privacy']:radio[value='1']").attr("checked",true);
   		}else{
   			$("input:radio[id='p_update_privacy']:radio[value='0']").attr("checked",true);
   		}
   		
//    		$("#p_update_content-length").html($("#p_update_content").val().length);
   		$("#p_update_category").children("option").each(function(){
   			if("${post.category}" == $(this).val()){
   				$(this).attr("selected","selected");
   				$("#p_update_category").selectpicker('refresh');
   			}
   		});
   		
   		/* var tags = "";
   		<c:forEach var="tag" items="${tags}" varStatus="idx">
			<c:choose>
				<c:when test="${idx.last}">tags += "${tag}";</c:when>
				<c:otherwise>tags += "${tag},";</c:otherwise>
			</c:choose>
		</c:forEach>
		$("#p_update_tag").val(tags).select2({tags:[],tokenSeparators: [",", " "]}); */
   		
   		$("#p_update_uploadImageSize").html($("#p_update_imagePreview").children("div").size());
		if($("#p_update_imagePreview").children("div").size() == 8){
			$("#p_update_imageUploadBtn").hide();
		}
   		$("#update-modal").modal("show");
   		$('input').iCheck('update');
   	}
   	
   	function remain_update_Content(){
  		var size = $("#p_update_content").val().length;
  		if(size > 370){
  			$("#p_update_content-length").css("color","#FF0000");
  		}else{
  			$("#p_update_content-length").css("color","#ccc");
  		}
  		$("#p_update_content-length").html(size);
  	}
   	
   	function update_uploadImgTrash(obj){
  		var imgPreview = $("#p_update_imagePreview");
  		var index = $(obj).parent().index()+1;
  		if(index == 8){
			$("#p_update_image8").val("");
		}else{
			for(index;index<9;index++){
				$("#p_update_image"+index).val($("#p_update_image"+index).next().val());
			}
		}
		$(obj).parent().remove();
  		imgPreview.sortable("refresh");
  		var imgUploadSize = imgPreview.children("div").size();
  		$("#p_update_uploadImageSize").html(imgUploadSize);
		$("#p_update_imageUploadBtn").show();
  	}
   	
   	function p_update_imagePreview(input){
  		var fileList = input.files;
  		var imgPreview = $("#p_update_imagePreview");
  		
  		try{
  			if(fileList.length > 8){
  	        	alert("사진을 8개 이하로 올려주세요");
  	        	input.value = "";
  	        }else{
  	        	var uploadSize = 0;
  	        	$("input.update_currentposition").each(function(){
  	        		if($(this).val() != ""){
  	        			uploadSize++;
  	        		}
  	        	});
  	        	if(uploadSize+fileList.length > 8){
  	        		alert("사진을 8개 이하로 올려주세요");
  	        	}else{
  	        		var imgSize = imgPreview.children("div").size();
  	                var bar = $(".progress-bar");
  	          		var progressBar = $("#update_progressBar");
  	          		var postWriteBtn = $("#postUpdateBtn");
  	                $.getScript('/resources/js/jquery.form.js', function(){
  	            		$("#update-img-form").ajaxSubmit({
  	            			statusCode: { 
  	            				400: function() {
  	            					alertShow("danger","오류가 발생하였습니다", 2000);
  	            				},
  	            				500: function() {
  	            					alertShow("danger","오류가 발생하였습니다", 2000);
  	            				}
  	            			},
  	            			dataType: "json",
  	            			beforeSubmit: function() {
  	            				postWriteBtn.hide();
  	            				var percentVal = '0%';
  	            		        bar.width(percentVal);
  	            		        progressBar.show();
  	            			},
  	            			uploadProgress: function(event, position, total, percentComplete) {
  	            				var percentVal = percentComplete + '%';
  	            		        bar.width(percentVal);
  	            		    },
  	            			success: function(data) {
  	            				for(var i=0;i<data.length;i++){
  	            					$("#p_update_image"+(imgSize+1)).val(data[i].image);
  	            					imgSize++;
  	            				}
  	            			},
  	            			complete: function(){
  	            				postWriteBtn.show();
  	            				progressBar.hide();
  	            			}
  	            		});
  	        		});
  	                
  	          		var anyWindow = window.URL || window.webkitURL;

  	                for(var i = 0; i < fileList.length; i++){
  	                	var objectUrl = anyWindow.createObjectURL(fileList[i]);
  	                	imgPreview.append("<div data-index='"+(i+1)+"'><img src='" + objectUrl + "' /><i class='fa fa-times' title='삭제' onclick='update_uploadImgTrash(this)'></i></div>");
  	                	//window.URL.revokeObjectURL(fileList[i]);
  	                }
  	                imgPreview.sortable("refresh");
  	                
  	                $("#p_update_uploadImageSize").html(imgPreview.children("div").size());
  	                if(imgPreview.children("div").size() == 8){
  	                	$("#p_update_imageUploadBtn").hide();
  	                }
  	                
  	        	}
  	        }
  		}catch(e){
  			$("#postUpdateBtn").hide();
  			$("#p_update_catchImgUploadBtn").show();
  		}
        
  	}
  	
  	String.prototype.parseTagUser = function() {
		hashpattern = /(@[A-Za-z0-9-_]+)/g;
		return this.match(hashpattern);
	};
	
  	function postUpdate(){
  		var bar = $(".progress-bar");
  		var progressBar = $("#update_progressBar");
  		var postWriteBtn = $("#postUpdateBtn");
  		var tagUser;
  		if($("#p_update_content").val() == ""){
  			alertShow("warning","설명을 입력해 주세요", 2000);
  			$("#p_update_content").focus();
  			return false;
  		}else{
  			tagUser = $("#p_update_content").val().parseTagUser();
  			if(tagUser != null) tagUser = tagUser.toString();
  			$("#p_update_tagUser").val(tagUser);
  		}
  		
  		if($("#p_update_image1").val() == ""){
  			alertShow("warning","사진을 하나라도 업로드 해주세요", 2000);
  			return false;
  		}
  		$("#p_update_tag").val(getHashtagParse());
  		$.getScript('/resources/js/jquery.form.js', function(){
    		$("#update-form").ajaxSubmit({
    			statusCode: { 
    				400: function() {
    					alertShow("danger","오류가 발생하였습니다", 2000);
    				},
    				500: function() {
    					alertShow("danger","오류가 발생하였습니다", 2000);
    				}
    			},
    			beforeSubmit: function() {
    				postWriteBtn.hide();
    				var percentVal = '0%';
    		        bar.width(percentVal);
    		        progressBar.show();
    			},
    			uploadProgress: function(event, position, total, percentComplete) {
    				var percentVal = percentComplete + '%';
    		        bar.width(percentVal);
    		    },
    			success: function(data) {
    				var percentVal = '100%';
    		        bar.width(percentVal);
    				if(data = "execute"){
    					alert('성공적으로 수정되었습니다');
    					document.location.reload();
    				}else if(data == "role"){
    					alertShow("danger","로그인이 필요합니다", 2000);
    				}else{
    					alertShow("danger","다시 시도해주세요", 2000);
    				}
    			},
    			complete: function(){
    				postWriteBtn.show();
    				progressBar.hide();
    			}
    		});
		});
  	}
  	
  	function getHashtagParse(){
  		var content = $("#p_update_content").val().match(/[#]+[A-Za-z0-9가-힣_]+/g);
  		if(content != null){
  			var hashtag = [];
  			$.each(content, function(i, el){
  				if($.inArray(el, hashtag) === -1) hashtag.push(el);
  			});
  			for(var i=0;i<hashtag.length;i++){
  				hashtag[i] = hashtag[i].substr(1);
  			}
  			return hashtag;
  		}else{
  			return "";
  		}
  	}
   	
   	</c:if>
</script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</body>
</html>